<!-- 1、then之后可以再次then,所以需要再一次调用MyPromise实例 -->
<script>
  function asyncFunc(callback) {
    if (typeof queueMicrotask === 'function') {
      queueMicrotask(callback)
    } else if (typeof MutationObserver === 'function') {
      const observer = new MutationObserver(callback)
      observer.observe(document.body, {
        childList: true,
      })
    } else if (typeof setTimeout === 'function') {
      setTimeout(callback)
    }
  }

  const PENDING = 'pending'
  const FULFILLED = 'fulfilled'
  const REJECTED = 'rejected'
  class MyPromise {
    constructor(executor) {
      this.state = PENDING
      this.result = undefined
      this.resolveCallbacks = []
      this.rejectCallbacks = []
      const resolve = (result) => {
        if (this.state === PENDING) {
          this.state = FULFILLED
          this.result = result
          this.resolveCallbacks.forEach((callback) => {
            callback(result)
          })
        }
      }
      const reject = (result) => {
        if (this.state === PENDING) {
          this.state = REJECTED
          this.result = result
          this.rejectCallbacks.forEach((callback) => {
            callback(result)
          })
        }
      }
      executor(resolve, reject)
    }

    then(onFulfilled, onRejected) {
      onFulfilled =
        typeof onFulfilled === 'function' ? onFulfilled : (value) => value
      onRejected =
        typeof onRejected === 'function'
          ? onRejected
          : (reason) => {
              throw reason
            }

      const promise2 = new MyPromise((resolve, reject) => {
        if (this.state === FULFILLED) {
          asyncFunc(() => {
            try {
              // 此处的x是第一次return的值
              const x = onFulfilled(this.result)
              console.log(x)
            } catch (e) {
              reject(e)
            }
          })
        }
        if (this.state === REJECTED) {
          asyncFunc(() => {
            try {
              const x = onRejected(this.result)
            } catch (e) {
              reject(e)
            }
          })
        }
        if (this.state === PENDING) {
          this.resolveCallbacks.push(() => {
            asyncFunc(() => {
              try {
                const x = onFulfilled(this.result)
              } catch (e) {
                reject(e)
              }
            })
          })
          this.rejectCallbacks.push(() => {
            asyncFunc(() => {
              try{
                const x = onRejected(this.result)
              }catch(e) {
                reject(e)

              }
              
            })
          })
        }
      })

      return promise2
    }
  }

  const p1 = new MyPromise((resolve, reject) => {
    resolve(1)
  })
  p1.then(
    (res) => {
      console.log(res)
      return 2 // 普通类型
      // return new MyPromise((resolve, reject) => {
      //   resolve(2)
      // }) // promise类型
      // return p1 // 循环引用
    },
    (res) => {
      console.log(res)
    }
  ).then((res) => {
    console.log(res)
  })
</script>
